<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<link rel="stylesheet" type="text/css" href="{$_C.hy_path}css/amazeui.min.css"/>
		<link rel="stylesheet" type="text/css" href="{$_C.hy_path}css/hy.admin.css"/>
		<style type="text/css">
			.hy-js-fieldarea label{ border: 2px solid #ddd; width: 100%;background: #ddd;height: 40px;border-radius: 4px;line-height: 30px;padding-left: 10px;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
		     .am-icon-photo{ cursor: pointer;}
		</style>
	</head>
	<body>
	<div class="am-g">
		 {include file='../Common/hy_header.html'}
		<div class="am-tabs am-margin" data-am-tabs="">
    <ul class="am-tabs-nav am-nav am-nav-tabs">
    	 <li class="am-active"><a hidefocus="true" href="#tab2">基本设置</a></li>
      <li class=""><a hidefocus="true" href="#tab1">其他详情</a></li>
       {if $_C.DIGLOSSIA==1}
       <li><a hidefocus="true" href="#tab4">英文详情</a></li>
       {/if}
    </ul>


    <form class="am-tabs-bd am-form hy-js-form" style="touch-action: pan-y; -webkit-user-select: none; -webkit-user-drag: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);">
      
      <div class="am-tab-panel am-fade" id="tab1">
          <div class="am-g am-margin-top">
            <div class="am-u-sm-2 am-text-right">
              显示名称
            </div>
            <div class="am-u-sm-4 am-u-end">
              <input type="text" name="name" value="{$art.name}" class="am-input-sm">
            </div>
          </div>
          <div {if $art.type eq 2 ||$art.type eq 3 ||$art.type eq 4} style="display: block;"{/if}  class="hy-radio hy-js-menupanel am-g am-margin-top hy-hide">
            <div class="am-u-sm-2 am-text-right">
              选项
            </div>
             <div class="am-u-sm-2">
              <input id="field-key" type="text" name="key" class="am-input-sm hy-js-key" value="" placeholder="选项名字">
             
            </div>
            <div class="am-u-sm-2">
              <input id="field-val" type="text" name="value" class="am-input-sm" value="" placeholder="选项值">
             
            </div>
            <div class="am-u-sm-2 am-u-end">
            	 <img class="hy-js-uploadimg" id="hy-thumb" style="height: 30px;cursor: pointer;" {if $art.thumb}src="{$art.thumb}"{else} src="{$_C.hy_path}images/logo2.png" {/if}>
                <input type="hidden" class="img-js-imgurl" name="" id="field-thumb" value="" />
                <button class="am-btn am-btn-primary am-btn-xs hy-js-newfield" >添加</button>
             	<a href="javascript:;" class="am-btn am-btn-primary am-btn-xs hy-js-fieldlist am-icon-list-ul" data-am-collapse="{ target: '#collapse-panel-1'}" ></a>
            </div>
          </div>
            <!--
            	显示字段
            -->
            <div class="am-g am-margin-top-sm ">
            	 <div class="am-u-sm-4 am-u-sm-offset-2 am-u-end hy-js-fieldarea am-panel-bd am-collapse am-in" id="collapse-panel-1">
            	 {if $art.field && ($art.type eq 2 ||$art.type eq 3 ||$art.type eq 4)}
            	 	 {foreach from=$art.field item=f}
            	 	  <label class="am-icon-close hy-js-delfield" style="border:2px solid #0e90d2"> 
            	 	  	{if $f.thumb}
            	 	  <img  style="height: 30px;"  src="{$f.thumb}">
            	 	  	{else}
	    	     	<span class="am-icon-photo"></span>
            	 	  	{/if}
            	 	  	{$f.key}-{$f.val}
            	 	  	<input checked="checked" type="hidden" class="hy-hide" name="field" id="" value='{$f.field}'></label>
            	 	 {/foreach}
            	 	 {/if}
            	 </div>
            </div>
            
          <div class="am-g am-margin-top-sm">
            <div class="am-u-sm-2 am-text-right">
             提醒语句
            </div>
            <div class="am-u-sm-4 am-u-end">
              <input type="text" name="tips" value="{$art.tips}" class="am-input-sm">
            </div>
          </div>
          <div class="am-g am-margin-top-sm">
            <div class="am-u-sm-2 am-text-right">
             默认值
            </div>
            <div class="am-u-sm-4 am-u-end">
              <input type="text" name="default" value="{$art.default}" class="am-input-sm">
            </div>
          </div>
      </div>
      <div class="am-tab-panel am-fade" id="tab4">
          <div class="am-g am-margin-top">
            <div class="am-u-sm-2 am-text-right">
              显示名称
            </div>
            <div class="am-u-sm-4 am-u-end">
              <input type="text" name="en_name" value="{$art.en_name}" class="am-input-sm">
            </div>
          </div>
          <div  {if $art.type eq 2 ||$art.type eq 3 ||$art.type eq 4} style="display: block;"{/if} class="hy-radio hy-js-menupanel am-g am-margin-top hy-hide">
            <div class="am-u-sm-2 am-text-right">
              选项
            </div>
             <div class="am-u-sm-2">
              <input id="field-key" type="text" name="key" class="am-input-sm hy-js-key" value="" placeholder="选项名字">
             
            </div>
            <div class="am-u-sm-2">
              <input id="field-val" type="text" name="value" class="am-input-sm" value="" placeholder="选项值">
             
            </div>
            <div class="am-u-sm-2 am-u-end">
            	 <img class="hy-js-uploadimg" id="hy-thumb" style="height: 30px;cursor: pointer;" {if $art.thumb}src="{$art.thumb}"{else} src="{$_C.hy_path}images/logo2.png" {/if}>
                <input type="hidden" class="img-js-imgurl" name="" id="field-thumb" value="" />
                <button data-english class="am-btn am-btn-primary am-btn-xs hy-js-newfield" >添加</button>
             	<a href="javascript:;" class="am-btn am-btn-primary am-btn-xs hy-js-fieldlist am-icon-list-ul" data-am-collapse="{ target: '#collapse-panel-1'}" ></a>
            </div>
          </div>
            
            <div class="am-g am-margin-top-sm ">
            	 <div class="am-u-sm-4 am-u-sm-offset-2 am-u-end hy-js-fieldarea am-panel-bd am-collapse am-in" id="collapse-panel-1">
            	 	 {if $art.en_field && ($art.type eq 2 ||$art.type eq 3 ||$art.type eq 4)}
            	 	 {foreach from=$art.en_field item=f}
            	 	  <label class="am-icon-close hy-js-delfield" style="border:2px solid #0e90d2"> 
            	 	  	{if $f.thumb}
            	 	  <img  style="height: 30px;"  src="{$f.thumb}">
            	 	  	{else}
	    	     	<span class="am-icon-photo"></span>
            	 	  	{/if}
            	 	  	{$f.key}-{$f.val}
            	 	  	<input checked="checked" type="hidden" class="hy-hide" name="en_field" id="" value='{$f.field}'></label>
            	 	 {/foreach}
            	 	 {/if}
            	 </div>
            </div>
            
          <div class="am-g am-margin-top-sm">
            <div class="am-u-sm-2 am-text-right">
             提醒语句
            </div>
            <div class="am-u-sm-4 am-u-end">
              <input type="text" name="en_tips" value="{$art.en_tips}" class="am-input-sm">
            </div>
          </div>
          <div class="am-g am-margin-top-sm">
            <div class="am-u-sm-2 am-text-right">
             默认值
            </div>
            <div class="am-u-sm-4 am-u-end">
              <input type="text" name="en_default" value="{$art.en_default}" class="am-input-sm">
            </div>
          </div>
      </div>
      <div class="am-tab-panel am-fade  am-active am-in" id="tab2">
      	 <div class="am-g am-margin-top">
            <div class="am-u-sm-2 am-text-right">
              字段名称
            </div>
            <div class="am-u-sm-4 am-u-end">
              <input type="text" name="data" value="{$art.data}" class="am-input-sm" placeholder="数据库的字段值，默认唯一,例如：username">
            </div>
          </div>
      	<div class="am-g am-margin-top">
          <div class="am-u-sm-2 am-text-right">数据类型</div>
          <div class="am-u-sm-4 am-u-end">
            <div class="am-btn-group hy-js-menutab" data-am-button="">
				<label data-target='#link1' class="hy-js-menubtn am-btn am-btn-default am-btn-xs {if $art.type}{if $art.type eq 0}am-active {else}{/if}{else}am-active {/if}">
					<input type="radio" {if $art.type}{if $art.type eq 0}checked="checked" {else}{/if}{else}checked="checked" {/if} name="type" value="0">
					单行文本
				</label>
				<label data-target='#link2' class="hy-js-menubtn am-btn am-btn-default am-btn-xs {if $art.type eq 1}am-active {else}{/if}">
					<input type="radio" name="type" {if $art.type eq 1}checked="checked" {else}{/if} value="1"> 
					多行文本
				</label>
				<label data-target='.hy-radio' class="hy-js-menubtn am-btn am-btn-default am-btn-xs {if $art.type eq 2}am-active {else}{/if}">
					<input type="radio" name="type" {if $art.type eq 2}checked="checked" {else}{/if} value="2"> 
					单选按钮
				</label>
				<label data-target='.hy-radio' class="hy-js-menubtn am-btn am-btn-default am-btn-xs {if $art.type eq 3}am-active {else}{/if}">
					<input type="radio" name="type" {if $art.type eq 3}checked="checked" {else}{/if} value="3"> 
					多选按钮
				</label>
				<label data-target='.hy-radio' class="hy-js-menubtn am-btn am-btn-default am-btn-xs {if $art.type eq 4}am-active {else}{/if}">
					<input type="radio" name="type" {if $art.type eq 4}checked="checked" {else}{/if} value="4"> 
					下拉列表
				</label>
				<label data-target='#link2' class="hy-js-menubtn am-btn am-btn-default am-btn-xs {if $art.type eq 5}am-active {else}{/if}">
					<input type="radio" name="type" {if $art.type eq 5}checked="checked" {else}{/if} value="5"> 
					上传
				</label>
			</div>
          </div>
         </div>
        <div class="am-g am-margin-top">
            <div class="am-u-sm-2 am-text-right">
              常用正则表达
            </div>
            <div class="am-u-sm-4 am-u-end">
            	<select name="pattern">
            		<option value="0">无正则</option>
            		<option value="1">电子邮件</option>
            		<option value="2">手机号码</option>
            		<option value="3">固话号码</option>
            	</select>
            </div>
          </div>
      </div>
   
      
 <input type="hidden" name="id" value="{$id}" />
    </form>
    <div class="am-margin">
    <button type="button" class="am-btn am-btn-primary hy-js-submit am-btn-xs">提交保存</button>
    
  </div>
  </div>
	</div>	
	 
	  {include file='../Common/hy_footer.html'}
	<script type="text/javascript" src="{$_C.hy_path}js/editor/kindeditor.js"></script>
	<script type="text/javascript">
	    hy_uploadimg('/field',{},function(result,_this){
	    	if(typeof(result[0])!='undefined')
	    	{ 
	        	_this.parent().parent().find('#hy-thumb').attr('src', result[0]);
			   _this.parent().parent().find('.img-js-imgurl').val(result[0]);
	       }
	    })
	    
	    $('.hy-js-key').keyup(function(){
	    	var val=$(this).parent().parent().find('#field-val');
	    		
	    //	if(val.val()==''||val.val()==$(this).val())
	    	//{
	    		val.val($(this).val())
	    	//}
	    
	    	//alert($(this).val());alert($(this).val());
	    });
	    $('.hy-js-newfield').click(function(e){
	    	e.preventDefault();
	    	var _this=$(this);
	    	var key=_this.parent().parent().find('#field-key').val();
	    	var val=_this.parent().parent().find('#field-val').val();
	    	if(key==''||val=='')
	    	{
	    		showMsg('选项名字和值不能为空');
	    		return;
	    	}
	    	var thumb=_this.parent().parent().find('#field-thumb').val();
	    	if(thumb!='')
	    	{
	    		var thumb_img='<img  style="height: 30px;"  src="'+thumb+'">';
	    	}
	    	else
	    	{
	    		var thumb_img='<span class="am-icon-photo"></span>';
	    	}
	    	{literal}
	    	var json='{"k":"'+key+'","v":"'+val+'","t":"'+thumb+'"}';
	    	{/literal}
	    	if(typeof($(this).attr('data-english'))!='undefined')
	    	{
	    		var field_name='en_field';
	    	}
	    	else
	    	{
	    		var field_name='field';
	    	}
	    	var html='<label class="am-icon-close hy-js-delfield" style="border:2px solid #0e90d2"> '+thumb_img+key+'-'+val+'<input checked="checked" type="hidden" class="hy-hide" name="'+field_name+'" id="" value=\''+json+'\'></label>'
	    	_this.parent().parent().parent().find('.hy-js-fieldarea').append(html);
	    	//清空数据
	    	_this.parent().parent().find('#field-thumb').val('');
	    	_this.parent().parent().find('#field-key').val('');
	    	_this.parent().parent().find('#field-val').val('');
	    	_this.parent().parent().find('#hy-thumb').attr('src','{$_C.hy_path}images/logo2.png');
	    	
	    });
	    
	     $('.hy-js-delfield').live('click',function(){
			    	if(confirm('你确定要删除这个选项吗？'))
			    	{    var _this=$(this);
			    	   _this.remove();
			    	}
			    	
			    })
	    hy_submit('index.php?g=admin&m=forms&a={$action}');
		
	</script>
	</body>
</html>
